<template>
	<view class="conten">
		<view class="record">
			<view class="wrap" v-for="(item,index) in navList">
				<view class="leave-record" @click="jumpLeave(item.url,item.title)" 
				:style="{'background':'linear-gradient(50deg,'+item.color+',#279aff)'}">{{item.title}}</view>
			</view>
			<!-- <view class="wrap"></view>
			<view class="destroyleave-record"  @click="jumpdestroyLeave">销假记录</view>
			<view class="quit-record"  @click="jumpQuit">离职记录</view>
			<view class="kaoqin-record"  @click="jumpkaoqin">考勤审批记录</view>
			<view class="salary-record"  @click="jumpsalary">工资审批记录</view> -->
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				navList:[
					{title:"请假记录",url:"../me/approvalRecord",color:"#404570"},
					{title:"销假记录",url:"../leave/destroyLeave/destroyList",color:"#136998"},
					{title:"离职记录",url:"../quit/quitRecord/quitRecord",color:"#52798a"},
					{title:"考勤审批记录",url:"../me/attendRcordExa/attendRcordExa",color:"#319e9e"},
					{title:"工资审批记录",url:"../salary/remineThing",color:"#528ba3"},
					{title:"绩效审批记录",url:"../merits/meritsExamine/meritsExamine?isShowBtn=1&&state=0",color:"#a34b1f"},
					{title:"专项绩效审批记录",url:"../special/specialExamine/specialExamine?isShowBtn=1&&state=0",color:"#d88724"},
					]
			};
		},
		methods:{
			jumpLeave(url,title){
				if(title=="绩效审批记录"||title=="专项绩效审批记录"){
					this.$store.commit("changeExa")
				}
				uni.navigateTo({
					url:url
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	@mixin record($color) {
		width: 100%;
		border-radius: 10rpx;
		background: $color;
		color: #FFFFFF;
		font-size: 30rpx;
		box-shadow: 0 5rpx 15rpx 5rpx rgba(204, 204, 204, 0.5);
	}
	.conten{
		width: 100%;
		display: flex;
		height: 100vh;
		background: #efefef;
	}
	.record{
		width: 85%;
		height: 55%;
		padding: 20rpx 10rpx;
		border-radius: 16rpx;
		display: flex;
		flex-wrap: wrap;
		background: #FFFFFF;
		margin: auto auto;
		.wrap{
			width: calc(100%/2);
			.leave-record{
				height: 140rpx;
				margin: 30rpx 20rpx;
				background: #aa226a;
				border-radius: 16rpx;
				text-align: center;
				font-size: 35rpx;
				color: #FFFDEF;
				font-weight: 600;
				line-height: 140rpx;
				box-shadow: 0 2px 4px rgba(0, 0, 0, .12);
			}
			// .quit-record{
			// 	@include  record(#FF632B)
			// }
			// .salary-record{
			// 	@include  record(#229940)
			// }
			// .kaoqin-record{
			// 	@include  record(#55aaff)
			// }
			// .destroyleave-record{
			// 	@include  record(#ff0004)
			// }
		}
	}
</style>
